/***************************************Panel Central Grilla Torneos*****************************/

Ext.Loader.setConfig({enabled: true});

Ext.Loader.setPath('Ext.ux', '../js/extjs/ext-4.0.1/examples/ux');

Ext.require(['Ext.data.*', 'Ext.grid.*']);
Ext.onReady(function() {

    var torneos = Ext.create('Ext.data.Store', {
        storeId: 'torneoStore',
        sorters: ['anioTorneo'],
        groupField: 'estadoTorneo',
	autoload: false,
	fields:[{name:'idtorneo', type:'int'},
		{name:'anioTorneo', type:'string'},
		{name:'modalidadTorneo', type:'string'},
		{name:'estadoTorneo', type:'string'},
                {name:'idPais', type:'string'}],
	proxy: {
                type: 'ajax',
                url: 'torneo/list', 
                reader: {
                        type: 'json',
                        root: 'items',
                        totalProperty: 'total'
                        }
		},
                
        listeners:{load: function(){Ext.getCmp("formInfoTorneo").getForm().loadRecord(torneos.getAt(0));}}
   });
   
   torneos.load();
    
    var groupingFeature = Ext.create('Ext.grid.feature.Grouping',{
        groupHeaderTpl: 'Estado: {name} ({rows.length} Item{[values.rows.length > 1 ? "s" : ""]})'
    });

    var grid = Ext.create('Ext.grid.Panel', {
        id:'gridTorneos',
        region: 'center',
        resizable: true,
        //renderTo: Ext.getBody(),
        //collapsible: true,
        iconCls: 'icon-grid',
        //frame: true,
        store: torneos,
        //width: 600,
        //height: 400,
        title: 'Torneos',
        features: [groupingFeature],
        columns: [{
            text: 'Año',
            flex: 1,
            dataIndex: 'anioTorneo'
        },{
            text: 'Modalidad',
            flex: 1,
            dataIndex: 'modalidadTorneo'
        },{
            text: 'Pais',
            flex: 1,
            dataIndex: 'idPais'
        }],
        fbar  : ['->', {
            text:'Clear Grouping',
            iconCls: 'icon-clear-group',
            handler : function(){
                groupingFeature.disable();
            }
        }],
    
        listeners:{itemclick: function(a,b,c,d)
			 {				  
                                var rec=torneos.getAt(d);                               
                                Ext.getCmp("fieldsetCrudTorneo").setTitle("Informacion Torneo");
				Ext.getCmp('formInfoTorneo').getForm().loadRecord(rec);
			      }}
    });
    
/**********************************************Panel Lateral Info Torneo********************************************************/
var funcNuevoTorneo =function()
{        
        Ext.getCmp("formCrudTorneo").getForm().submit({
            url:'torneo/registrar',
            method:'POST',
            clientValidation: false,
            
            success: function(form,action)
                    {
                            var obj = Ext.JSON.decode(action.response.responseText);
                            if(obj.success)
                            {            
                                   Ext.example.msg('Creación Torneo', 'Se creó el torneo con éxito.');
                                    ventanaFormTorneo.hide();                                    
                                    Ext.getCmp("gridTorneos").getStore().load();            
                                    formCrudTorneo.getForm().reset(); 
                            }
                            else   alert(' registro fallo.');
                    },
            failure: function(form,action)
                    {
                        Ext.example.msg('Creación Torneo', 'Error en la creacion del torneo.');
                    }          
        });
}

var estados = Ext.create('Ext.data.Store', {
    fields: ['abbr', 'valorEstado'],
    data : [
        {"abbr":"0", "valorEstado":"Inactivo"},
        {"abbr":"1", "valorEstado":"Activo"}
    ]
});

  var comboEstadoTorneo=new Ext.form.ComboBox({
        // all of your config options
        fieldLabel:'Estado',
        //hideLabel: true,
        id:'comboEstadoTorneo',   
        name:'estadoTorneo',
        //triggerAction: 'all',
        //lazyRender:true,
        //editable:false,    
        //hiddenName:'valEstadoTorneo',           
        store:estados,
        displayField: 'valorEstado',
        queryMode: 'local',
        emptyText: 'Estado', 
        valueField: 'abbr',
        //allowBlank:false,
        renderTo: Ext.getBody(),
                                listeners:{
                      select: function(combo,record,index)
                            {
                            
                            }
                      }
  }); 
  
var comboModalidadTorneo=new Ext.form.ComboBox({
        // all of your config options
        fieldLabel:'Modalidad',
        //hideLabel: true,
        id:'comboModalidadTorneo',   
        name:'modalidadTorneo',
        //triggerAction: 'all',
        //lazyRender:true,
        editable:false,    
        //hiddenName:'valEstadoTorneo',           
        store:  new Ext.data.Store({
                            fields:['abbr', 'name'],
                            data: [
                                    {"abbr":"IM", "name":"Individual Masculino"},
                                    {"abbr":"IF", "name":"Individual Femenino"},
                                    {"abbr":"D", "name":"Dobles"}
                                  ]
            }),
            displayField: 'name',
            emptyText: 'Modalidad', 
            valueField: 'abbr',
            allowBlank:false,
                        listeners:{
                      select: function(combo,record,index)
                            {
                              
                            }
                      }
  }); 

var comboPaises=new Ext.form.ComboBox({
        // all of your config options
        fieldLabel:'País',
        //hideLabel: true,
        id:'ventanaFormTorneo',   
        name:'paisTorneo',
        triggerAction: 'all',
        lazyRender:true,
        editable:false,    
        hiddenName:'idPais',
        valueField: 'idPais',           
        store:  new Ext.data.Store({autoLoad: true,
                            fields:[{name:'idPais',type:'int'},{name:'nombrePais',type:'string'}],
                            proxy: {type: 'ajax',
                                    url: 'utilidades/getPaises',  // url that will load data with respect to start and limit params        
                                    reader: {
                                          type: 'json',
                                          root: 'items',
                                          totalProperty: 'total'}}
            }),

            displayField: 'nombrePais',
            listeners:{
                      select: function(combo,record,index)
                            {
                              
                            }
                      },
            mode: 'remote',
            emptyText: 'País',            
            allowBlank:false
  }); 
  
  var formCrudTorneo= new Ext.form.Panel({	
                fieldDefaults: {msgTarget: 'side'},                 
                autoHeight: true,
		frame:true,
		autoWidth:true,
                id:'formCrudTorneo',
		layout:'anchor',
		defaults:{anchor:'100%', xtype:'textfield'},          
		
		items:[{xtype:'fieldset',
                        
                        id:'fieldsetCrudTorneo',
			title:'Ingrese Datos del Torneo',
			//height:'100%',
                        width:'100%',
			autoHeight: true,
			defaults:{ xtype:'textfield',labelWidth:120},
			
			items: [
                                {xtype:'hiddenfield', name:'idTorneo'},
                              {xtype:'datefield', fieldLabel:'Año',name:'anioTorneo', format: 'Y-m-d'},
				//comboPaises,    
                                comboModalidadTorneo,
				comboEstadoTorneo
                               ] 
			}],
                    buttons:[{text:'Registrar',
                              id:'butRegTorneo',
                              handler: funcNuevoTorneo
                            },/*{
                                text:'Guardar Cambios',                                
                                id:'butEditJuez',
                                handler: funcEditFormJuez
                            },*/{text:'Cancelar',
                                handler: function()
                                {ventanaFormTorneo.hide();
                                 formCrudTorneo.getForm().reset();
                                }
                            }]
	}); 
        
     var formInfoTorneo= new Ext.form.Panel({
                region: 'east',
                width: '48%',
		frame:true,
                id:'formInfoTorneo',
		layout:'anchor',
		defaults:{anchor:'100%'},
                fieldDefaults: {msgTarget: 'side'},
		height:'100%',
		items:[{xtype:'fieldset',
                        id:'fieldsetInfoTorneo',
			title:'Informacion Torneo',
			height:'100%',
                        autoWidth: true,
			defaults:{ xtype:'displayfield',labelAlign:'left',labelWidth:'110',labelStyle:'font-weight:bold;'},
			
			items: [{xtype:'hiddenfield', name:'idTorneo'},
                                {fieldLabel:'Año', name:'anioTorneo'},
				{fieldLabel:'Modalidad',name:'modalidadTorneo'},
				{fieldLabel:'Estado',name:'estadoTorneo'},
				{fieldLabel:'Pais Realización',name:'idPais'}                           
                               ] 
			}]
});

var ventanaFormTorneo = new Ext.Window({
	id     : 'ventanaFormTorneo',
        title:'Crear Torneo',
	modal: true,
	closable:false,
	draggable: false, 
	autoHeight: true,
	autoWidth  : true,
	items  : [formCrudTorneo]
});

if(rolUsuario=="Administrador" || rolUsuario=="Organizador")
 {
     formInfoTorneo.addDocked({xtype:'toolbar',dock:'bottom',items:['->',{
                    icon: '../../../js/extjs/ext-4.0.1/examples/shared/icons/fam/user-add.gif',
                   // cls: 'x-btn-icon',
                    id:'tbutRegTorneo',
                    text: 'Crear Torneo',
                    scope: this,
                    
                    handler: function()
                             { Ext.getCmp("fieldsetCrudTorneo").setTitle("Informacion nuevo torneo");
                               ventanaFormTorneo.setTitle("Crear Torneo");
                               ventanaFormTorneo.show();                               
                               Ext.getCmp("butRegTorneo").show();
                             }
                },{xtype:'tbseparator', id:'tbseparator'},
                {
                    id:'botInscJug',
                    text:'Inscripciones',
                    scope: this
                }
                ]});
 
 }

/*************************************Union Paneles en el Tab**********************************/
    
var panelTabCrud= new Ext.panel.Panel({
	layout: 'border',
	id:'panelTabCrud',
        border: 0,
	width: '100%',
	height: '100%',
	items:[grid,formInfoTorneo]

    });
    
    Ext.getCmp('tabGestionTorneo').add(panelTabCrud);
    Ext.getCmp('panelContenido').setActiveTab(panelTabCrud);
    Ext.getCmp('panelContenido').doLayout();
    Ext.getCmp('tabGestionTorneo').doLayout();
});